<template>
	<view>
	<uni-nav-bar dark :fixed="true" shadow background-color="#007AFF" status-bar left-icon="left" left-text="返回" @clickRight="backWork" right-icon="home"
		:title=this.titleName @clickLeft="back" />
			<uni-table ref="table" border stripe style="margin-top: 0px;" >
				<uni-tr>
					<uni-th width="60" align="center">季度</uni-th>
					<uni-th width="70" align="center">库存数量</uni-th>
					<uni-th width="80" align="center">库存成本金额</uni-th>
					<uni-th width="80" align="center">估算销售金额</uni-th>
					<uni-th width="80" align="center">报表</uni-th>
				</uni-tr>
				<uni-tr v-for="(item, index) in tableData" :key="index">					
					<uni-td align="center">{{ item.quanter }}</uni-td>
					<uni-td align="center">{{ item.quantity }}</uni-td>
					<uni-td align="center">{{ item.costAmount }}</uni-td>		
					<uni-td align="center">{{ item.salesAmount }}</uni-td>
					<uni-td align="center">
						<view class="uni-group">
							<!-- <uni-icons type="redo" size="30" @click="details(item.quanter)"></uni-icons> -->
							<button size="mini" type="primary" style="height: 25px;width: 50px;background-color: rgb(0, 122, 255)" @click="details(item.quanter)" icon='shop'>
								<text style="font-size: 12px; position: absolute; left: 12px;top: -1px;">品牌</text>
							</button>
							<button size="mini" type="primary" style="height: 25px;width: 50px;background-color: palevioletred" @click="categoryDetails(item.quanter)" icon='shop'>
								<text style="font-size: 12px; position: absolute; left: 12px;top: -1px;">类别</text>
							</button>
						</view>
					</uni-td>
				</uni-tr>
			</uni-table>
	</view>
</template>

<script>
	import {baseUrl} from 'libs/util/global'
	export default {
		data() {
			return {
				loading: false,	
				titleName: '',
				chainStoreName: '',
				year: '',
				storeId: '',				
				tableData: [],
				authority: null
			}
		},
		onLoad: function(option) { //option为object类型，会序列化上个页面传递的参数
			uni.getStorage({
				key: 'authority',
				success:(res) =>{
					console.log(res.data + "登录用户权限:"+res.data)
					this.authority  = res.data
				}
			});
			this.chainStoreName = option.chainStoreName
			console.log("库存季度页面："+option.year)
			this.year = option.year
			console.log("库存季度页面："+option.storeId)
			this.storeId = option.storeId
		},
		mounted() {
			this.getInfo(),
			this.getBoxHeight(),
			this.initTitleName()
		},
		methods: {
			// 初始化页面标题
			initTitleName(){
				this.titleName = this.chainStoreName.substring(0,6) + this.year
			},
			//获取盒子高度
			getBoxHeight() {
				uni.createSelectorQuery()
					.in(this)
					.select('.table-header')
					.boundingClientRect(rect => {
						if (rect) {
							this.boxHeight = rect.height;
						}
					})
					.exec();
			},
			
			// 左上角返回按钮
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			backWork(){
				uni.switchTab({
					url: '/pages/work/work'
					})
			},
			// 获取信息
			getInfo() {
				uni.showLoading({
				title: '加载中.....'
				})
				uni.request({
					url: baseUrl+'/chain/inventory/quanter?storeId='+this.storeId+'&year='+this.year,
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					method: 'GET',
					data: {},
					success: (res) => {
						setTimeout(function() {
							uni.hideLoading();
						}, 100);
						if (res.data.data != null) {
							if(this.authority == 2){
								console.log("// 连锁店信息"+res.data)
								for( let index = 0; index< res.data.data.length; index++){
									console.log(res.data.data[index])
									res.data.data[index].costAmount = "0.00"
								}								
								this.tableData = res.data.data	
							}else{
								this.tableData = res.data.data	
							}
						}
					}
				})
				
				
			},
			// 进入品牌详情
			details(quanter) {
				console.log("年份："+this.year)
				console.log("季度："+quanter)
				console.log("店铺id："+this.storeId)
				
				uni.navigateTo({
					url: '/pages/form/inventory/quanterInventory/brandInventory/brandInventory?year=' + this.year +
					'&quanter='+ quanter + 
					'&storeId=' + this.storeId +
					'&chainStoreName=' + this.chainStoreName
				})
			},
			// 进入类别详情
			categoryDetails(quanter) {
				console.log("年份："+this.year)
				console.log("季度："+quanter)
				console.log("店铺id："+this.storeId)
				
				uni.navigateTo({
					url: '/pages/form/inventory/quanterInventory/categoryInventory/categoryInventory?year=' + this.year +
					'&quanter='+quanter+ 
					'&storeId=' + this.storeId +
					'&chainStoreName=' + this.chainStoreName
				})
			}
		}
	}
</script>

<style>
	.content {
			width: 100%;
			height: 100vh;
		}

	.table-header {
		position: sticky;
		left: 0;
		top: 0;
		z-index: 99999;
		background-color: #fff;
	}
	//冻结表头第一列
	/deep/ .uni-table-tr .uni-table-td:first-child {
		position: sticky;
		left: 0;
		top: 0;
		background-color: lavenderblush;
		z-index: 1;
	}

	/deep/ .uni-table-tr {
		overflow: visible;
		background-color: #fff;
	}

	/deep/ .uni-table-tr .uni-table-th:first-child {
		position: sticky;
		left: 0;
		top: 0;
		background-color: #fff;
		z-index: 1;
	}

</style>
